<ul class="nav nav-tabs" role="tablist">  
  <li><a href="{{$this->Html->url('/admin/projects/view/'.$model_item['project_id'])}}">Project Information</a></li>
  <li class="active"><a href="#">Task and bid Information</a></li>
</ul>
<div id="task-info">
<style>
.execute-file-list .col-md-4{margin-bottom:16px;padding:0 8px;}
.execute-file-list .btn{display:block;text-align:left;border-radius:0px;height:64px;overflow:hidden;}
.execute-file-list .filename{height:24px;overflow:hidden;}
.execute-file-list small{font-size:12px;}
.execute-file-list .glyphicon-cloud-download{font-size:40px;float:left;margin-right:15px;}
.upload-progress{width:120px;float:left;}
.panel-title-filename {display:block;}
.panel-body{padding:5px 15px;}
.progressContainer{width:auto;border:none;}
.progressName{float:none;font-size:12px;font-weight: normal;}
.datepicker{z-index:10000;}
.datepicker .day{cursor:pointer;}
.table2 .th {width: 5%;}
.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td{border:0;}
table {border-collapse: initial;}
.bid-partner{background-color:#efefef;border:1px solid #CCC;}
.bid-partner.active{background-color:#FFF;border:1px solid red;}
pre {background-color: transparent;font-size: 14px;}
blockquote { border-left: 2px solid #eee; font-size: 12px; margin: 10px 0 10px; padding: 10px;}
</style>
	<h3 class="name">{{$model_item['name']}}</h3>
	<div class="detail">	
		<p><strong>{{__('Time period')}}:</strong> &nbsp;&nbsp; {{$model_item['start_time']}} ~ {{$model_item['end_time']}}</p>
		<p>{{$model_item['content']}}</p>
		
		<p><strong>{{__('Skills')}}</strong>:{{loop $datainfo['Tag'] $tag}} &nbsp; <label class="label label-primary">{{$tag['name']}}</label> &nbsp;{{/loop}}</p>
		
		{{if $model_item['status'] == 0 && time() < strtotime($model_item['bid_end_time']) }}
			<p><strong>Tender end time</strong>: {{$model_item['bid_end_time']}}</p>
			<table>
			<tr>
				<td style="width:100px;"><strong>{{__('Time left')}}:</strong></td>
				<td><div id="DateCountdown" data-date="{{$model_item['bid_end_time']}}" style="width: 360px; height: 85px; padding: 0px; box-sizing: border-box;"></div>
				</td>
				</tr>
			</table>
		{{/if}}
		
		<div class="row">
		{{loop $datainfo['Uploadfile'] $file}}
			<div class="col-sm-3">
			{{if strpos($file['type'],'image')!==false}}
				<a href="/uploadfiles/download/{{$file['id']}}" target="_blank"><img src="{{$file['thumb']}}"/></a>
				<a href="/uploadfiles/download/{{$file['id']}}" class="btn btn-default" target="_blank">{{$file['name']}}</a>
			{{else}}
				<a href="/uploadfiles/download/{{$file['id']}}" class="btn btn-default" target="_blank">{{$file['name']}}</a>
			{{/if}}
			</div>
		{{/loop}}
		</div>
	</div>
	
	<div class="detail">
	
	<?php
/****
 * $tasking['Tasking']['status']
    				 * 任务参与的状态：
					 * 小于等于9的状态仅对咨询师可见
    				 * 0 参与任务，制定了计划
    				 * 1 指定了计划，未投标但投标已结束，计划作废		 
    				 
    				 * 
    				 * 
    				 * 大于9以上的状态对客户与咨询师都可见。 
    				 * 10 参与投标，等待投标审批    	
    				 * 11 参与投标不成功
    				 * 12 任务失败
    				 
    				 * 13 投标通过，成功参与任务
    				 * 14 任务开始
    				 * 15 任务完成
    				 */

	?>
	{{if $model_item['status'] != 0}}
			<div class="label label-default">{{__('Bid is over')}}</div>
	{{else}}
		{{if time() < strtotime($model_item['bid_end_time']) }}
			<p class="label label-primary">{{__('Bidding，choose the partner and start the task')}}</p>
		{{else}}
			<p> <span class="label label-default">{{__('Bid is over and nobody win.')}}</span> </p>
		{{/if}}
		
		<div class="mt10">
		{{if $current_tasking['status']==10}}
			<a class="btn btn-warning" onclick="return confirm('{{__('Are you sure to access this bid? Others will get failed.')}}');" href="{{$this->Html->url('/admin/tasks/accept_bid/'.$task_id.'/'.$current_tasking['id'])}}">{{__('Accept this bid')}}</a>
		{{/if}}
		</div>
	{{/if}}
	
	<div class="alert alert-warning mt10"><i class="glyphicon glyphicon-info-sign"></i> A task can only choose one partner to execute. When select one,the other partner that joined this tender will get failed.</div>
		
	{{if !empty($bid_partners)}}
		<!--Customer not choose a bid partner. show customer bid partner list. -->
		<h3>{{__('Bid partners')}} &nbsp; &nbsp;<small>Tips:click partner to view his task plan.</small></h3>
					
		<div class="row">
		{{loop $bid_partners $item_all}}
				<div class="col-md-3" >
					<div class="bid-partner p5 {{if $item_all['Tasking']['user_id']==$plan_user_id}}active{{/if}}">
						<h4> <a href="{{$this->Html->url('/admin/tasks/view/'.$task_id.'?user_id='.$item_all['Partner']['user_id'])}}">{{$item_all['Partner']['name']}}</a></h4>
					{{if $item_all['Tasking']['status'] < 10}}
						<a class="btn btn-warning btn-xs">{{__('Bid not submit')}}</a>
					{{elseif $item_all['Tasking']['status']==10}}
						<a class="btn btn-primary btn-xs" href="{{$this->Html->url('/admin/tasks/view/'.$task_id.'?user_id='.$item_all['Partner']['user_id'])}}">{{__('View the task plan')}}</a>
						
					{{elseif $item_all['Tasking']['status']==11}}
						<a class="btn btn-warning btn-xs">{{__('Bid failed')}}</a>
					{{elseif $item_all['Tasking']['status']==13}}
						<a class="btn btn-success btn-xs" >{{__('Win the bid')}}</a>
					{{elseif $item_all['Tasking']['status']==14}}
						<a class="btn btn-success btn-xs">{{__('Win the bid and task started')}}</a>
					{{elseif $item_all['Tasking']['status']==15}}
						<a class="btn btn-success btn-xs">{{__('Win the bid and task wait confirm')}}</a>
					{{elseif $item_all['Tasking']['status']==16}}
						<a class="btn btn-success btn-xs">{{__('Win the bid and task confirm finished')}}</a>
					{{/if}}
					 <a class="btn btn-primary btn-xs mt10" href="{{$this->Html->url('/admin/partners/view/'.$item_all['Partner']['id'])}}">{{__('View partner detail')}}</a> 
						<div><strong>Price:</strong> <span class="color-orange"><strong>{{$item_all['Tasking']['price']}}</strong></span></div>
						<div>{{$item_all['Tasking']['start_date']}}~{{$item_all['Tasking']['end_date']}}</div>
					</div>
				</div>
		{{/loop}}
		</div>
	{{/if}}
	
		<div class="panel-group" id="accordion">
		{{if !empty($task_executes)}}
			
			{{if $tasking['Uploadfile']}}
			<h3>{{__('Task bid files')}}</h3>
			<div id="fileuploadinfo_bid_files_{{$tasking['Tasking']['id']}}" class="execute-file-list row">
		                	{{loop $tasking['Uploadfile'] $file}}
		                	<div class="col-md-4">
			                  <a target="_blank" title="{{$file['name']}}" href="/uploadfiles/download/{{$file['id']}}" class="btn btn-success ">
			                  	<i class="glyphicon glyphicon-cloud-download"></i>
			                  	<div class="filename">{{$file['name']}}</div>
			                  	<small>{{getHumanFileSize($file['size'])}}</small>
			                  </a>
			                </div> 
		                  	{{/loop}}
		    </div>
		    {{/if}}
			<h3>{{__('Task plan')}}</h3>
		{{loop $task_executes $execute}}
			<?PHP $item = $execute['TaskExecute']; ?>
					 <div class="panel panel-default">
	                  <div class="panel-heading">
	                  
	                        	{{if $item['status'] >= 2}}
	                        		<i class="fa fa-stop"></i> 
	                        	{{else}}
	                        		{{if $item['start_date'] < date('Y-m-d H:i:s')}}
	                        			<i class="fa fa-pause"></i>
	                        		{{else}}
	                        			<i class="fa fa-play"></i>
	                        		{{/if}}
	                        	{{/if}}
	                                     
	                            <a class="" data-toggle="collapse" data-parent="#accordion" href="#collapse-task-{{$item['id']}}">
	                              {{$item['name']}}
	                            </a>
	                        	<a data-toggle="collapse" data-parent="#accordion" href="#collapse-task-{{$item['id']}}">
	                        	 {{if $item['status'] < 2}}
	                        	 	<img src="{{$this->Html->url('/img/rs/arrow1-up.png')}}" alt="">
	                        	 {{else}}
	                        	 	<img src="{{$this->Html->url('/img/rs/arrow1-down.png')}}" alt="">
	                        	 {{/if}}
	                        	</a>
	                  </div>
	                  <div class="panel-body bbline1">
		                  <div class="row">
		                  	<div class="col-md-6"><strong>Time period:</strong> {{$item['start_date']}} ~ {{$item['end_date']}}</div>
		                  	<div class="col-md-6">
		                  		<?php $day_left = intval((strtotime($item['end_date'])-time())/86400); if($day_left < 0) $day_left = 0; ?>
		                  		<strong>Time left:</strong>  {{$day_left}} days
		                  			{{if in_array($current_tasking['status'],array(13,14)) }}
					                	{{if $item['status'] == 2}}
					                		<input type="button" data-execute_id="{{$item['id']}}" class="btn btn-xs btn-warning pull-right confirm-finished" value="Confirm Finished">
					                	{{elseif $item['status'] == 3}}
					                		<label class="btn btn-xs btn-success pull-right">confirm finished</label>
					                	{{elseif $item['status'] == 1}}
					                		<label class="btn btn-xs disabled btn-primary pull-right">Executing.</label>
					                	{{else}}
					                		<label class="label label-default  pull-right">wait start</label>
					                	{{/if}}
					                {{/if}}
		                  	</div>
		                  </div>
	                  </div>
	                  <div id="collapse-task-{{$item['id']}}" class="panel-collapse collapse  {{if $item['status'] != 3}}in{{/if}}">
	                    <div class="panel-body">
	                    	<div>{{nl2br($item['content'])}}</div>
	                    	<table class="table">
				                {{if $item_all['Uploadfile']}}
	                  			<tr  class="bbline1"><td colspan="4">
					                <div id="fileuploadinfo_execute_files_{{$item['id']}}" class="execute-file-list row">
					                	{{loop $item_all['Uploadfile'] $file}}
					                	<div class="col-md-4">
						                  <a target="_blank" title="{{$file['name']}}" href="/uploadfiles/download/{{$file['id']}}" class="btn btn-success ">
						                  	<i class="glyphicon glyphicon-cloud-download"></i>
						                  	<div class="filename">{{$file['name']}}</div>
						                  	<small></small>
						                  </a>
						                </div> 
					                  	{{/loop}}
					                </div>
					             </td></tr>
					             {{/if}}
					              <tr>
					                <td colspan="4">
					                
			{{$this->Form->create('Comment',array('id'=>'CommentAddForm-'.$item['id'],'action'=>'add','onsubmit'=>'return AddTaskComment(this,"#comment-list-'.$item['id'].'");','class'=>"cmt-body",'role'=>"form",))}}
			   <div class="form-group">
			   	 {{$this->Form->input('data_id',array('type'=>'hidden','value'=> $item['id']))}}
				{{$this->Form->input('type',array('type'=>'hidden','value'=> 'TaskExecute'))}}
			     <textarea id="CommentBody" placeholder="{{__('Enter your comment here')}}" rows="2" name="data[Comment][body]" class="form-control"></textarea>
			   </div>
			   <div class="form-group">
			   <button class="btn btn-primary btn-sm fr" type="submit">{{__('Submit comment')}}</button>
			   </div>
			</form>
					                </td>
					              </tr>
					              <tbody id="comment-list-{{$item['id']}}">
					              {{loop $execute['Comment'] $comment}}
					              {{if $comment['user_id']!=$plan_user_id}}
					              <tr id="comment-item-{{$comment['id']}}">
					                <td colspan="4">
					                  <img class="pull-left"  style="width:50px;height:50px;" src="{{$this->Html->url('/img/rs/headshot.jpg')}}">
					                  <div class="popover show right pull-left" style="position:relative;margin-left:15px;max-width:70%;width:70%;">
					                    <div class="arrow" style="top:30px;"></div>
					                    <div class="popover-content">
					                      <p>{{$comment['body']}}</p>
					                      <p>{{$comment['created']}}</p>
					                    </div>
					                  </div>
					                </td>
					              </tr>
					              {{else}}
					              <tr id="comment-item-{{$comment['id']}}">
					                <td colspan="4">
					                  <img class="pull-right" style="width:50px;height:50px;" src="{{$this->Html->url('/img/rs/headshot.jpg')}}">
					                  <div class="popover show left pull-right" style="position:relative;margin-right:15px;max-width:70%;width:70%;">
					                    <div class="arrow" style="top:30px;"></div>
					                    <div class="popover-content">
					                      <p>{{$comment['body']}}</p>
					                      <p>{{$comment['created']}} &nbsp;&nbsp; <a class="reply-link" data-cid="{{$comment['id']}}" href="javascript:void(0);">Reply</a></p>
					                    </div>
					                  </div>				                  
					                </td>
					              </tr>
					              {{/if}}
					               <tr id="CommentReplyForm-{{$comment['id']}}" style="display:none;"><td colspan="4">
					              	{{$this->Form->create('Comment',array('action'=>'add','onsubmit'=>'return AddTaskComment(this,"#comment-list-'.$item['id'].'");','role'=>"form",))}}
									   <div class="form-group form-inline" style="margin-left:60px;">
									   	 {{$this->Form->input('data_id',array('type'=>'hidden','value'=> $item['id']))}}
									   	 {{$this->Form->input('parent_id',array('type'=>'hidden'))}}
										{{$this->Form->input('type',array('type'=>'hidden','value'=> 'TaskExecute'))}}
									     <input id="CommentBody" type="text" placeholder="{{__('Reply comment')}}" name="data[Comment][body]" style="width:400px;" class="form-control"></input>
									     <button class="btn btn-primary btn-sm" type="submit">{{__('reply_comment')}}</button>
									   </div>
									{{$this->Form->end()}}
					              </td></tr>				              
					              {{/loop}}
					              
					              </tbody>
					             <tr>
					                <td colspan="4" class="center">
					                  <div><a href="javascript:void(0);" data-id="{{$item['id']}}" data-page="2" data-append="append" class="load-more-content more1">{{__('Read more')}}</a></div>
					                </td>
					              </tr>
					              
				            </table>                    	
	                    </div>
	                  </div>
	                </div>
		{{/loop}}
		{{/if}}
		</div>
				
	</div>
</div>

{{$this->Html->css(array('bootstrap-datepicker.css'))}}

{{$this->Html->script(array('TimeCircles/TimeCircles.js'))}}
{{$this->Html->css(array('/js/TimeCircles/TimeCircles.css'))}}

{{$this->Html->script(array(
	'bootstrap-datepicker.js',
	'swfupload/swfupload.js',
	'swfupload/swfupload.queue.js',
	'swfupload/swfupload.cookies.js',
	'swfupload/fileprogress.js',
	'swfupload/handlers.js',
))}}


<script type="text/javascript">

$(function(){
	$("#DateCountdown").TimeCircles({
		start: true, // determines whether or not TimeCircles should start immediately.
		animation: "smooth", // smooth or ticks. The way the circles animate can be either a constant gradual rotating, slowly moving from one second to the other. 
		count_past_zero: true, // This option is only really useful for when counting down. What it does is either give you the option to stop the timer, or start counting up after you've hit the predefined date (or your stopwatch hits zero).
		circle_bg_color: "#ddd", // determines the color of the background circle.
		use_background: true, // sets whether any background circle should be drawn at all. 
		fg_width: 0.1, //  sets the width of the foreground circle. 
		bg_width: 1.2, // sets the width of the backgroundground circle. 
		text_size: 0.1, // This option sets the font size of the text in the circles. 
		total_duration: "Auto", // This option can be set to change how much time will fill the largest visible circle.
		direction: "Clockwise", // "Clockwise", "Counter-clockwise" or "Both".
		use_top_frame: false,
		start_angle: 0, // This option can be set to change the starting point from which the circles will fill up. 
		time: { //  a group of options that allows you to control the options of each time unit independently.
			Days: {
			show: true,
			text: "Days",
			color: "#6CBB6F"
			},
			Hours: {
			show: true,
			text: "Hours",
			color: "#6CBB6F"
			},
			Minutes: {
			show: true,
			text: "Min",
			color: "#6CBB6F"
			},
			Seconds: {
			show: true,
			text: "Sec",
			color: "#6CBB6F"
			}
		}
	});

	//$('.datepicker').datepicker();
    var nowTemp = new Date();
    var now = new Date(nowTemp.getFullYear(), nowTemp.getMonth(), nowTemp.getDate(), 0, 0, 0, 0);
     
    var checkin = $('#TaskingStartDate').datepicker({
	    onRender: function(date) {
	    	return date.valueOf() < now.valueOf() ? 'disabled' : '';
	    }
    }).on('changeDate', function(ev) {
    	if (ev.date.valueOf() > checkout.date.valueOf()) {
		    var newDate = new Date(ev.date)
		    newDate.setDate(newDate.getDate() + 1);
		    checkout.setValue(newDate);
	    }
	    checkin.hide();
	    $('#TaskingEndDate')[0].focus();
    }).data('datepicker');
    
    var checkout = $('#TaskingEndDate').datepicker({
	    onRender: function(date) {
	    	return date.valueOf() <= checkin.date.valueOf() ? 'disabled' : '';
	    }
    }).on('changeDate', function(ev) {
    	checkout.hide();
    }).data('datepicker');
    
	$('.confirm-finished').click(function(){
		if(!confirm('Are you sure to confirm finished?')){
			return false;
		}
		var execute_id = $(this).data('execute_id');
		$.ajax({
			async:true,
			type:'get',
			success:function(request, xhr) {
				if(request.success){
					window.location.reload();
				}
				else{
					alert(request.error);				
				}
			},
			url : BASEURL+'/admin/tasks/confirm_execute_finished/'+ execute_id,
			dataType:'json'
		}) ;
		return true;
	})
	
})

function upload_execute_file(file, serverData){
	try {
		var progress = progress_list[file.id];
		progress.setComplete();
		if (serverData === " ") {
			this.customSettings.upload_successful = false;
		} else {
			var data=eval("(" + serverData + ")");
			if(data.status==1){
				this.customSettings.upload_successful = true;
				var filesize = '';
				if(data.size/1024/1024 >1){
					
					filesize = Math.round(data.size/1024/1024*100)/100 +'MB';
				}
				else if(data.size/1024 >1){
					filesize = Math.round(data.size/1024*100)/100 +'KB';
				}
				else{
					filesize = data.size + 'B';
				}
				
				$("#fileuploadinfo_execute_files_"+data.data_id).append('<div class="col-md-4">'+
		                 ' <a target="_blank" href="/uploadfiles/download/'+data.id+'" class="btn btn-success "><i class="glyphicon glyphicon-cloud-download"></i><div>'+data.name+'</div><small>File Size: '+ filesize +'</small></a>'+
			             '</div>');
			}
		}
	} catch (e) {
		alert(serverData);
	}
	
}
$(function(){
	$('#accordion').on('hide.bs.collapse', function () {
		  // do something…
		  $(this).find('.panel-collapse').each(function(){
			  if($(this).hasClass('in')){
				  var obj = $(this).siblings('.panel-heading').find('.th3');
				  obj.find('img').attr('src','{{$this->Html->url('/img/rs/arrow1-down.png')}}');
			  }
			  else{
				  var obj = $(this).siblings('.panel-heading').find('.th3');
				  obj.find('img').attr('src','{{$this->Html->url('/img/rs/arrow1-up.png')}}');
			  }	 
		  })
		});
	$('#accordion').on('show.bs.collapse', function () {
		  // do something…
		  $(this).find('.panel-collapse').each(function(){
			  if($(this).hasClass('in')){
				  var obj = $(this).siblings('.panel-heading').find('.th3');
				  obj.find('img').attr('src','{{$this->Html->url('/img/rs/arrow1-down.png')}}');
			  }
			  else{
				  var obj = $(this).siblings('.panel-heading').find('.th3');
				  obj.find('img').attr('src','{{$this->Html->url('/img/rs/arrow1-up.png')}}');
			  }	 
		  })
		});
	
	$('.load-more-content').click(function(){
		var page = $(this).data('page');
		loadCommentData('TaskExecute',$(this).data('id'),page);
		$(this).data('page',parseInt(page)+1);
	});
	$(document).on('click','.reply-link',function(){		
		var cid = $(this).data('cid');
		var txt = $(this).data('txt');
		if($('#CommentReplyForm-'+cid).css('display')=="none"){
			/*if(txt){
				$('#CommentReplyForm-'+exid).find('#CommentBody').val(txt);
			}
			else*/
			{
				$('#CommentReplyForm-'+cid).find('#CommentBody').val('');
			}		
			$('#CommentReplyForm-'+cid).find('#CommentParentId').val(cid);
			$('#CommentReplyForm-'+cid).insertAfter($(this).parents('tr:first')).show();
		}
		else{
			var txt  = $('#CommentReplyForm-'+cid).find('#CommentBody').val();
			$(this).data('txt',txt);
			$('#CommentReplyForm-'+cid).hide();
		}
		
	});
});



function loadCommentData(model,id,page){
	$.ajax({
		async:true,
		type:'get',
		success:function(request, xhr) {
			for(var i in request){
				showCommentItem(request[i]['Comment'],'#comment-list-'+id,'append');
			}
		},
		url: BASEURL +"/admin/comments/getlist/"+ model +"/"+id+'.json?page='+page,		
		dataType:'json'
	});
}




function showCommentItem(item,tselector,append_type){
	var str = '';
	{{if $plan_user_id}}
		if(item['user_id'] != {{$plan_user_id}}){
			str = '<tr><td colspan="4"><img class="pull-left" title="'+item['username']+'" style="width:50px;height:50px;" src="{{$this->Html->url('/img/rs/headshot.jpg')}}">'
	+'<div class="popover show right pull-left" style="position:relative;margin-left:15px;max-width:400px;width:400px;">'
	+'<div class="arrow" style="top:30px;"></div>'
	+'<div class="popover-content"><p>'+item['username']+':'+item['body']+'</p>'+item['created']+'</div></div></td></tr>'
	;
		}
		else
	{{/if}}
		{		
			str = '<tr><td colspan="4"><img class="pull-right" title="'+item['username']+'" style="width:50px;height:50px;" src="{{$this->Html->url('/img/rs/headshot.jpg')}}">'
			+'<div class="popover show left pull-right" style="position:relative;margin-left:15px;max-width:400px;width:400px;">'
			+'<div class="arrow" style="top:30px;"></div>'
			+'<div class="popover-content"><p>'+item['username']+':'+item['body']+'</p>'+item['created']+' &nbsp; <a class="reply-link" data-cid="'+item['id']+'" href="javascript:void(0);">Reply</a>'+'</div></div></td></tr>'
			;
		}
	
	if(append_type == "append"){
		$(tselector).append(str);
	}
	else{
		$(tselector).prepend(str);
	}
}



function AddTaskComment(form,tselector){
			
	$.ajax({
		async:true,
		type:'post',
		success:function(request, xhr) {
			if(request.success){
				//showSuccessMessage(request.success);
				if(request['Comment']){
					showCommentItem(request['Comment'],tselector);
					//$('#CommentBody',form).val('');
				}
			}
			else{
				alert(errorinfo);				
			}
		},
		url:"{{$this->Html->url(array('controller'=>'comments','action'=>'add'))}}",
		data:$(form).serialize(),
		dataType:'json'
	}) ;
	return false;
}


//]]>
</script>